<template>
  <div class="awsCenter">
    <div style="border: black 0px solid;width: 100%;height: 550px;display: flex;
flex-direction: column;
align-items: center;">
      <!--    按钮栏    -->
      <div class="awsCenter" style="width: 100%;height: 40px;border: black 0px solid">
        <el-select clearable v-model="counselor" placeholder="咨询师" style="width: 200px">
          <el-option
            v-for="item in counselorList"
            :key="item.counselorId"
            :label="item.realname"
            :value="item.counselorId"
          />
        </el-select>
        <el-button @click="getCounselor()" style="width: 80px;margin-left: 10px" type="primary" plain>查询</el-button>

      </div>


      <!--   表格    -->
      <el-table  :data="feedbackData" stripe style="width: 100%;margin-top: 20px" height="700px" :row-style="{ height: '80px' }">
        <el-table-column  width="55" />

        <el-table-column prop="userRealname" label="来访者" width="200px"/>
        <el-table-column prop="counselorname" label="咨询师" width="200px"/>
        <el-table-column prop="content" label="反馈内容" width="600px"/>
        <el-table-column  label="综合评分" width="200">
          <template #default="scope">
            <el-tag type="warning">{{scope.row.rating.toFixed(2)}}</el-tag>
          </template>
        </el-table-column>

        <el-table-column prop="createdat" label="创建时间" width="250px"/>

      </el-table>

      <!-- 分页条 -->
      <div  class="demo-pagination-block">
        <el-pagination
          style="margin-top: 20px"
          v-model:current-page="currentPage"
          :page-size="8"
          :size="size"
          :disabled="disabled"
          :background="background"
          layout="total, prev, pager, next"
          :total="total"
          @current-change="handleCurrentChange"
        />
      </div>




    </div>
  </div>
</template>

<script lang="ts" setup>

import { Delete, Edit } from '@element-plus/icons-vue'
import { onMounted, ref } from 'vue'
import { getAllCounselorService, getFeedbackService } from '@/api/feedback.js'
import { type ComponentSize, ElMessage } from 'element-plus'
import moment from 'moment/moment'

const counselorList=ref([])
const size = ref<ComponentSize>('default')
const background = ref(false)
const disabled = ref(false)

const feedbackData=ref([])

onMounted(async ()=>{
  //挂载时查询当前所有咨询师
  const res= await getAllCounselorService()
  if (res.code===200){
    counselorList.value=res.data

  }

  //获取列表信息
  const getFeedRes=await getFeedbackService(getFeedbackDto.value)
  if (getFeedRes.code===200){
    feedbackData.value=getFeedRes.data.data
    total.value=getFeedRes.data.total
    dateFormat()
  }

})

const dateFormat=(()=>{

  feedbackData.value.forEach(item=>{
    item.createdat=moment(item.createdat).format('YYYY-MM-DD HH:mm:ss');
    item.updatedat=moment(item.updatedat).format('YYYY-MM-DD HH:mm:ss');
  })
})

const counselor=ref('')
const total=ref(0)
const currentPage = ref(1)
const getFeedbackDto = ref({
  current: currentPage.value,
  pageSize: 8,
  counselorid: '',
})
//查询
const getCounselor=(async ()=>{
  getFeedbackDto.value={
    current: currentPage.value,
    pageSize: 8,
    counselorid: counselor.value,
  }
  console.log(getFeedbackDto.value)
  //获取列表信息
  const getFeedRes=await getFeedbackService(getFeedbackDto.value)
  if (getFeedRes.code===200){
    feedbackData.value=getFeedRes.data.data
    total.value=getFeedRes.data.total
    dateFormat()
  }
})

const handleCurrentChange = async (val: number) => {
  getFeedbackDto.value={
      current: val,
      pageSize: 8,
    counselorid: counselor.value,
  }
  //获取列表信息
  const getFeedRes=await getFeedbackService(getFeedbackDto.value)
  if (getFeedRes.code===200){
    feedbackData.value=getFeedRes.data.data
    total.value=getFeedRes.data.total
    dateFormat()
  }

}


</script>

<style>

</style>
